// 通过vue.config.js修改webpack的默认配置
// chainWebpack可以通过链式编程的形式，修改webpack配置
// configureWebpack可以通过操作对象的形式，修改webpack配置
module.exports = {
  // 为开发模式与发布模式指定不同的打包入口
  chainWebpack: config => { // 通过chainWebPack自定义打包入口
    // 发布模式
    //entry找到默认的打包入口, 调用clear则是删除默认的打包入口, add添加新的打包入口
    config.when(process.env.NODE_ENV === 'production', config => {
      config
        .entry('app') // 得到默认的打包入口
        .clear() // 清空默认的打包入口
        .add('./src/main-prod.js') // 新增一个自己的打包入口文件

      //默认情况下，依赖项的所有第三方包都会被打包到js/chunk-vendors.******.js文件中，导致该js文件过大,那么我们可以
      //通过externals排除这些包，使它们不被打包到js/chunk-vendors.******.js文件中
      //使用externals设置排除项
      config.set('externals', {
        vue: 'Vue',
        'vue-router': 'VueRouter',
        axios: 'axios',
        lodash: '_',
        echarts: 'echarts',
        nprogress: 'NProgress',
        'vue-quill-editor': 'VueQuillEditor'
      })

      // 首页内容的定制
      config.plugin('html').tap(args => {
        args[0].isProd = true
        return args
      })
    })

    // 开发模式
    config.when(process.env.NODE_ENV === 'development', config => {
      config
        .entry('app')
        .clear()
        .add('./src/main-dev.js')

      // 首页内容的定制
      config.plugin('html').tap(args => {
        args[0].isProd = false
        return args
      })
    })
  }
}

